<template>
    <div class="flexbox flex">
        <div class="b1"></div>
        <div class="b2"></div>
        <div class="b3"></div>
    </div>
</template>
<script setup>
</script>
<style lang="scss" scoped>
.flexbox {
    div {
        flex-basis: 100px;
        height: 100px;
        border-radius: 5px;   
    }

    .b1 {
        background-color: aquamarine;
    }

    .b2 {
        background-color: rgb(222, 121, 255);
        flex-grow: 0.2;//分配剩余空间
        margin: 0 10px;
    }

    .b3 {
        background-color: rgb(51, 54, 219);
        flex-grow: 0.1;//分配剩余空间
    }
}

.flex{
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}
</style>